<!doctype html>
<html lang="cn">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <!--<title>Document</title>-->
    <link rel="stylesheet" href="/static/app/lib/iconfont/iconfont.css">
    <link rel="stylesheet" href="/static/app/css/style.css">
    <script src="/static/app/lib/zy.rem.js"></script>
    <script src="/static/app/lib/jquery1.12.3.min.js"></script>
    <script src="/static/app/js/base.js"></script>
    <script src="/static/layer/layer.min.js"></script>
</head>
<style>
    .sb-info .sb-name {
        font-size: .2rem;
        color: #4c4c4c;
    }
    .pick {
        background: white;
        border-radius: .04rem;
        margin-top: 0.2rem;
    }
    .center {
        padding: 0.1rem 0.3rem 0.3rem 0.3rem;
    }
    .pick .top {
        height: 1rem;
    }
</style>
<body>
<div class="header">
    <div><a href="{:url('Index/device')}">
        <img src="/static/app/img/fanh.png"></a></div>
    <div>查看录音</div>
    <div></div>
</div>

<div class="center" style="height: 9rem;">
    {foreach name="data.data" key="key" item="v"}
    <div class="pick">
        <div class="top">
            <!--<i class="iconfont icon-dianliang"></i>-->
            <div class="sb-info" style="padding: .3rem 0.5rem 0;">
                <div class="sb-name">录音时间:{$v.createTime|date='Y-m-d H:i:s',###}</div>
                <a onclick="bofang(this,'{$v.attrJson}',{$v.deviceImei})" data-dd="1"><img src="/static/app/img/lubo1.png" style="height: 0.45rem;position: absolute;top:0.3rem;left: 6rem;" ></a>
            </div>
        </div>
        <!--<div class="but">-->
            <!--<a href="{:url('Map/mapdata')}?imei="><i class="iconfont">&#xe627;</i>地图</a>-->
            <!--<a href="{:url('Index/luyin_view')}?imei="><img src="/static/app/img/chakan.png" style="position: relative;height: 0.37rem;top: 0.09rem;">查看录音</a>-->
            <!--<a href="{:url('Core/devedit')}?imei="><i class="iconfont">&#xe614;</i>设备管理</a>-->
        <!--</div>-->
    </div>
    {/foreach}
</div>

{include file='public:bottom'}
</body>
<script src="/static/app/benz-amr-recorder-master/BenzAMRRecorder.js"></script>
<script>
    function luyin(imei,expire_time) {
        $.ajax({
            url:"{:url('Index/luyin')}",
            type:'POST',
            data:{
                imei:imei,
                expire_time:expire_time
            },
            dataType: 'json',
            success:function(res){
                if (res.code != 200) {
                    layer.msg(res.result.msg, {shade: 0.5, time: 1000,icon: 2});
                    return false;
                }
                layer.msg(res.result.msg, {shade: 0.5, time: 800, icon: 1}, function(){
                    // window.location.href="{:url('index')}";
                    window.location.reload();
                });
            }
        });
    }
    //播放录音
    function bofang(obj,url,imei) {
        $.ajax({
            url:"{:url('Index/testDown')}",
            type:'POST',
            data:{
                urldata:url,
                imei:imei
            },
            dataType: 'json',
            success:function(res){
                if (res.code != 200) {
                    layer.msg(res.msg, {shade: 0.5, time: 1000,icon: 2});
                    return false;
                }
                //判断是否在播放中
                if($(obj).attr('data-dd')==1){
                    $(obj).children().attr('src','/static/app/img/lubo2.png');
                    $(obj).attr('data-dd',2);
                    amr = new BenzAMRRecorder();
                    amr.initWithUrl(res.data).then(function () {
                        if (amr.isPlaying()) {
                            amr.stop();
                        } else {
                            amr.play();
                        }
                    });
                    setInterval(function working(){
                        $(obj).children().attr('src','/static/app/img/lubo1.png');
                        $(obj).attr('data-dd',1)
                    },12000);
                }else {
                    layer.msg('正在播放', {shade: 0.5, time: 1000,icon: 1});
                    return false;
                }
            }
        });
    }
</script>
</html>